.schema-property-indicator {
  @mixin circle-pill($bg, $size) {
    @include pill($bg, get-color(white));
    @include round-image($size);
    @include flex-column-center;
    display: inline-flex;
  }

  & + & {
    margin-left: item-spacing(1);
  }

  &--nullable {
    @include circle-pill(get-color(red5), 20px);
  }

  &--indexed {
    @include circle-pill(get-color(orange5), 20px);
  }

  &--partitioned {
    @include circle-pill(get-color(green5), 20px);
  }

  &--distributed {
    @include circle-pill(get-color(blue5), 20px);
  }
}
